<!-- main header start -->
<div class="main-header d-none d-lg-block">

    <!-- header middle area start -->
    <div class="header-main-area sticky">
        <div class="container">
            <div class="row align-items-center position-relative">

                <!-- start logo area -->
                <div class="col-lg-3">
                    <div class="logo">
                        <a href="index.html">
                            <img src="/img/logo.png" alt="">
                        </a>
                    </div>
                </div>
                <!-- start logo area -->

                <!-- main menu area start -->
                <div class="col-lg-6 position-static">
                    <div class="main-menu-area">
                        <div class="main-menu">
                            <!-- main menu navbar start -->
                            <nav class="desktop-menu">
                                <ul>
                                    <li><a href="index.html">主页</a></li>
                                    <li><a href="shop.html">商品</a></li>
                                    <li><a href="product-details.html">产品详情</a></li>
                                </ul>
                            </nav>
                            <!-- main menu navbar end -->
                        </div>
                    </div>
                </div>
                <!-- main menu area end -->

                <!-- mini cart area start -->
                <div class="col-lg-3">
                    <div class="header-configure-wrapper">
                        <div class="header-configure-area">
                            <ul class="nav justify-content-end">
                                <li>
                                    <a href="#" class="offcanvas-btn">
                                        <i class="lnr lnr-magnifier"></i>
                                    </a>
                                </li>
                                <li class="user-hover">
                                    <a href="#">
                                        <i class="lnr lnr-user"></i>
                                    </a>
                                    <ul class="dropdown-list">
                                        <li><a href="#">login</a></li>
                                        <li><a href="#">register</a></li>
                                        <li><a href="#">my account</a></li>
                                    </ul>
                                </li>
                                <li>
                                    <a href="#">
                                        <i class="lnr lnr-heart"></i>
                                        <div class="notification">0</div>
                                    </a>
                                </li>
                                <li>
                                    <a href="#" class="minicart-btn">
                                        <i class="lnr lnr-cart"></i>
                                        <div class="notification">2</div>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
                <!-- mini cart area end -->

            </div>
        </div>
    </div>
    <!-- header middle area end -->
</div>
<!-- main header start -->

<!-- mobile header start -->
<div class="mobile-header d-lg-none d-md-block sticky">
    <!--mobile header top start -->
    <div class="container">
        <div class="row align-items-center">
            <div class="col-12">
                <div class="mobile-main-header">
                    <div class="mobile-logo">
                        <a href="index.html">
                            <img src="/img/logo/logo.png" alt="Brand Logo">
                        </a>
                    </div>
                    <div class="mobile-menu-toggler">
                        <div class="mini-cart-wrap">
                            <a href="#">
                                <i class="lnr lnr-cart"></i>
                            </a>
                        </div>
                        <div class="mobile-menu-btn">
                            <div class="off-canvas-btn">
                                <i class="lnr lnr-menu"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- mobile header top start -->
</div>
<!-- mobile header end -->